<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>结算界面</title>
    <link rel="stylesheet" href="../plugins/layui/layui-v2.5.6/layui/css/layui.css">
    <link rel="stylesheet" href="../css/index.css">
    <link rel="stylesheet" href="../css/buycar.css">
    
    <style>
        #account-outer{
            width: 100%;
            height: 100%;
        }

        .account-mid{
            width: 80%;
            height: 100%;
            margin:auto;
            background-color:white;

}

        .account-product{
            width: 100%;
            height: 300px;
            border: 1px solid #efefef;
        }
        .account-product01{
            width: 30%;
            height: 100%;
            border: 1px solid #efefef;
          float: left;
        }
        .account-product02{
            width: 67%;
            height: 100%;
            border: 1px solid #efefef;
            float: right;
        }

        
        .bott{
    background-color: #eaeaea;
    width: 100%;
    
}
    .bott-f{
        width: 1200px;
        margin: 0 auto;
    }

        
    </style>
</head>
<body>

    <div id="account-outer">
        <script src="../plugins/layui/layui-v2.5.6/layui/layui.js"></script>
        <script>
          layui.use(['form', 'element'], function(){
         var element = layui.element; 
        var form=layui.form;
     
     //监听导航点击
     element.on('nav(demo)', function(elem){
     //console.log(elem)
     layer.msg(elem.text());

     form.on('select(phone_type)', function(data){
        // console.log(data.elem.checked); //是否被选中，true或者false
        console.log(data.value); //复选框value值，也可以通过data.elem.value得到
    });
     });
    });
        </script>

<div class="nav">
    <div style="padding-left: 80px;">
    <i class="layui-icon layui-icon-home" style="font-size: 20px; color: gray;"></i> 
   <a href="../index.html">店铺首页</a>
    <i class="layui-icon layui-icon-location" style="font-size: 20px; color: gray;"></i>
    安徽
    <div class="nav2">
        <span class="layui-breadcrumb" lay-separator="|" style="padding-left: 90px;">
            <a href="../view/login.html">登录</a>
            <a href="..view/register.html">注册</a>
            <a href="../view/self-center.html">个人中心</a>
            <a href="../view/order.html" style="padding-left:20px ;">我的订单</a>
            <a href="../view/collect.html"style="padding-left:20px ;">我的生鲜</a>
            
            <a href="../view/seckile.html"style="padding-left:20px ;">限时秒杀</a>
            <a href="../view/forum.html"style="padding-left:20px ;">好物推荐</a>
           
          </span>              
    </div>
    </div>
</div>




<div class="account-mid">

    <div class="buycar-rearch">
        <div class="nav-logo">
            <div class="search">
                <div class="layui-container">
                    <!-- 定义行 -->
                    <div class="layui-row">

                        <div class="layui-col-md3">

                    <img src="../img/logo.png" style="height: 90px; margin-top: 40px;">
                </div>
    
                <div class="layui-col-md6" style="margin-top: 50px; text-align: center;">
                    <span id="fc1" style=" font-size: 40px; font-family: '宋体' serif; color: red;">结算页</span>
                </div>


                    </div>
                    </div>
                </div>
            </div>
        </div>

        <hr class="layui-bg-gray">

        <div class="buycar-mid01">
            <a style="font-size: 20px;">填写并合对订单界面</a>
        </div>


        <hr class="layui-bg-gray">



        <div class="buycar-mid01">

        <div class="layui-container">
            <div class="layui-row">

                <div class="layui-col-md10">
               <p style="font-size: 15px;">收货人信息</p> 
               </div>

            <div class="layui-col-md2" >
                <a style="color: blue;" href="../view/account-setting.html">+新增收货地址</a> 
            </div>


            </div>
         </div> 

        </div>


        <div class="buycar-mid01">

            <div class="layui-container">
                <div class="layui-row">
                    <div class="layui-col-md9" style="margin-left: 50px;">
                   <a >小夏</a>
                   <a> 江苏省苏州市工业园区8080号</a> 
                   <a> 12******89</a>
                   </div>
    
                <div class="layui-col-md2" >
                    <a>设置地址</a> 
                    <a>编辑</a> 
                </div>
    
                </div>
             </div> 
    
            </div>

            <div class="buycar-mid01"style="margin-left: 65px;">
                <a>更多地址</a> 
                <i class="layui-icon layui-icon-down" style="font-size: 20px; color: gray;"></i>

            </div>

            <div class="buycar-mid01" style="margin-left: 65px;">
                <a style="font-size: 20px; color: red;"> 提示:</a>
                <a>存在不支持自提的商品或该地址下没有可用的自提点</a>
                <a style="margin-left: 30px;">详情</a>
            </div>

            <hr class="layui-bg-gray">

            <div class="buycar-mid01" style="margin-left: 20px;">
                <p style="font-size: 15px;">支付方式</p> 
                </div>


            <div class="buycar-mid01 layui-form">

                <div class="layui-container">
                    <div class="layui-row">
                        <div class="layui-col-md9" style="margin-left: 50px;">
                            <input type="checkbox" name="" title="货到付款" style="margin-left: 100px;">
                            <input type="checkbox" name="" title="在线支付">
                       </div>
        
                    <div class="layui-col-md2" >
                        <a>更多</a>
                 <i class="layui-icon layui-icon-right" style="font-size: 20px; color: gray;"></i>
                    </div>
        
                    </div>
                 </div> 
        
                </div>

            <hr class="layui-bg-gray">

            <div class="buycar-mid01">

                <div class="layui-container">
                    <div class="layui-row">
        
                        <div class="layui-col-md8">
                       <p style="font-size: 15px;">送货清单</p> 
                       </div>
        
                    <div class="layui-col-md2" >
                        <a style="color: blue;">价格说明</a> 
                    </div>

                    <div class="layui-col-md2" >
                        <a style="color: blue;" href="../view/buycar.html">返回修改购物车</a> 
                    </div>
        
        
                    </div>
                 </div> 
        
                </div>
                
                <div class="account-product">
                    <div class="account-product01">
                        <div class="way" style="width: 100%;height: 25px;">
                            <p style="font-size: 13px; color: gray; margin-left: 20px;">配送方式</p>
                        </div>
                        <div class="way layui-form" style="width: 100%;height: 50px; margin-left: 20px;">
                            <input type="checkbox" name="" title="快递运送">
                        </div>

                        <div class="way" style="width: 100%;height: 25px;">
                            <a style="color: gray; margin-left: 20px;"> 配送时间:</a>
                            <a>工作日、双休日与节假日均可送货</a>
                        </div>

                    </div>

                    <div class="account-product02">
                        <div class="way" style="width: 100%;height: 25px;">
                            <p style="font-size: 13px;  margin-left: 20px;">商家：海南生鲜店</p>
                        </div>
                        <div class="way" style="width: 100%;height: 25px;">
                            <p style="font-size: 13px;  margin-left: 20px;">活动商品购满166.0元，即可享受满减优惠且免邮</p>
                        </div>

                        <div class="way02">

                            <div class="layui-container">
                                <div class="layui-row">
                    
                                    <div class="layui-col-md2">
                                   <img src="../img/8.jpg" style="height: 150px; width: 150px;">
                                   </div>
                    
                                <div class="layui-col-md2" style="margin-top: 20px;">
                                    <a>【法国名品 直降2800】情侣款【2双立减10】专柜定制 原装直邮 轻奢手工V6缓震透气</a> 
                                    <p>款式：最新款</p> 
                                    <p>尺码：23</p> 
                                    <p style="color: blue;">支持7天无理由退货</p> 
                                </div>
            
                                <div class="layui-col-md2" style="padding-top: 20px; font-size: 20px;">
                                    <a style="color: red; margin-left: 20px;">￥200.0</a> 
                                </div>
                                <div class="layui-col-md1" style="padding-top: 20px;">
                                    <a >x1</a> 
                                </div>
                                <div class="layui-col-md1" style="padding-top: 20px;">
                                    <a >有货</a> 
                                </div>
                    
                    
                                </div>
                             </div> 
                    
                            </div>

                           
                                <div class="way" style="width: 100%;height: 25px;">
                                    <a>【赠品】</a>
                                    <a>使用指南</a>
                                    <a style="color: gray;">查看价格</a>
                                </div>
                                <div class="way" style="width: 100%;height: 25px;">
                                    <a>【赠品】</a>
                                    <a>使用指南</a>
                                    <a style="color: gray;">查看价格</a>
                                </div>
                                <div class="way" style="width: 100%;height: 25px; margin-top: 15px;">
                                    <a style="margin-left: 10px;">留言：</a>
                                    <input type="text" style="width: 300px;">
                                </div>

                    </div>

                </div>
        
                <hr class="layui-bg-gray">

                <div class="buycar-mid01" style="margin-left: 20px;">
                    <p style="font-size: 15px;">发票信息</p> 
                    </div>
                    <div class="buycar-mid01" style="margin-left: 20px;">
                        <a>不开发票</a> 
                        <a style="color: blueviolet;">修改</a>
                        </div>
                        <div class="buycar-mid01" style="margin-left: 20px;">
                            <a style="font-size: 15px;">使用优惠/礼品卡/抵用</a> 
                            <i class="layui-icon layui-icon-down" style="font-size: 20px; color: gray;"></i>
                           </div>
                           <hr class="layui-bg-gray">

                           <div class="buycar-mid01" style="margin-left: 20px;">
                            <a style="margin-left: 800px;">一件商品，</a>
                            <a>总金额：</a>
                            <a>￥109</a>
                            </div>

                            <div class="buycar-mid01" style="margin-left: 20px;">
                                <a style="margin-left: 800px;">运费：</a>
                                <a>￥10.0</a>
                                </div>

                                <hr class="layui-bg-gray">

                                <div class="buycar-mid01" style="margin-left: 20px;">
                                    <a style="margin-left: 800px;">应付总额：</a>
                                    <a style="color: red; font-size: 40px;">￥109.0</a>
                                    </div>

                                    <div class="buycar-mid01" style="margin-top: 50px;">
                                        <a style="margin-left: 650px;">寄送至：</a>
                                        <a> 江苏省苏州市工业园区8080号</a> 
                                        <a> 收货人</a>
                                        <a> 小夏</a>
                                        <a> 123******89</a>
                                        </div>
                                        <hr class="layui-bg-gray">
                                        
                                    <div class="buycar-mid01">
                                        <div class="buy-select02 layui-form" style="text-align: center; margin-left: 800px"> 
                                            <a href="www.zhifubao.com"><button type="button" class="layui-btn layui-btn-danger">提交订单</button></a>
                                            <!-- <button type="button" class="layui-btn layui-btn-danger">提交订单</button> -->
                                        </div>
                                        </div>
                                        <hr class="layui-bg-gray">


                                        
    

    






                        
               
    








    </div>

</div>
























    </div>

    <div class="bott">
        <div class="bott-f">
            <div class="layui-row">
                <div class="layui-col-md3">
                    <div style="font-size: 10px;">
                        <li><img src="../img/duo.png" alt="">品类齐全,轻松购物</li>
                    </div>
                </div>
                <div class="layui-col-md3">
                    <div style="font-size: 10px;">
                        <li><img src="../img/kuai.png" alt="">多仓直发,极速配送</li>
                    </div>
                </div>
                <div class="layui-col-md3">
                    <div style="font-size: 10px;">
                        <li><img src="../img/hao.png" alt="">正品行货,精致服务</li>
                    </div>
                </div>
                <div class="layui-col-md3">
                    <div style="font-size: 10px;">
                        <li><img src="../img/sheng.png" alt="">天天低价,畅选无忧</li>
                    </div>
                </div>
            </div>

            <div class="layui-row" style="margin-top: 15px;">
                <div class="layui-col-md3">
                    <div>
                        <dt>购物指南</dt>
                        <dd>
                            <a rel="nofollow" target="_blank" href="#">购物流程</a>
                        </dd>
                        <dd>
                            <a rel="nofollow" target="_blank" href="#">会员介绍</a>
                        </dd>
                        <dd>
                            <a rel="nofollow" target="_blank" href="#">常见问题</a>
                        </dd>
                        <dd>
                            <a rel="nofollow" target="_blank" href="#">热销商品</a>
                        </dd>
                        <dd>
                            <a rel="nofollow" target="_blank" href="#">联系客服</a>
                        </dd>
                    </div>
                </div>
                <div class="layui-col-md3">
                    <div>
                        <dt>配送方式</dt>
                        <dd>
                            <a rel="nofollow" target="_blank" href="#">上门自提</a>
                        </dd>
                        <dd>
                            <a rel="nofollow" target="_blank" href="#">211限时达</a>
                        </dd>
                        <dd>
                            <a rel="nofollow" target="_blank" href="#">配送服务查询</a>
                        </dd>
                        <dd>
                            <a rel="nofollow" target="_blank" href="#">配送费收取标准</a>
                        </dd>
                        <dd>
                            <a target="_blank" href="#">海外配送</a>
                        </dd>
                    </div>
                </div>
                <div class="layui-col-md3">
                    <div>
                        <dt>支付方式</dt>
                        <dd>
                            <a rel="nofollow" target="_blank" href="#">货到付款</a>
                        </dd>
                        <dd>
                            <a rel="nofollow" target="_blank" href="#">在线支付</a>
                        </dd>
                        <dd>
                            <a rel="nofollow" target="_blank" href="#">分期付款</a>
                        </dd>
                        <dd>
                            <a rel="nofollow" target="_blank" href="#">公司转账</a>
                        </dd>
                    </div>
                </div>
                <div class="layui-col-md3">
                    <div>
                        <dt>售后服务</dt>
                        <dd>
                            <a rel="nofollow" target="_blank" href="#">售后政策</a>
                        </dd>
                        <dd>
                            <a rel="nofollow" target="_blank" href="#">价格保护</a>
                        </dd>
                        <dd>
                            <a rel="nofollow" target="_blank" href="#">退款说明</a>
                        </dd>
                        <dd>
                            <a rel="nofollow" target="_blank" href="#">返修/退换货</a>
                        </dd>
                        <dd>
                            <a rel="nofollow" target="_blank" href="#">取消订单</a>
                        </dd>
                    </div>
                </div>
            </div>
        </div>

</div>
    
</body>
</html>